<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div>
    <canvas id="canvas" width="1600" height="1000"></canvas>
  </div>
  <script>
    const canvas = document.getElementById('canvas');
    const ctx = canvas.getContext('2d');
    let mix = 6000
    let canvas_width = canvas.width || document.documentElement.clientWidth
    let canvas_height = canvas.height || document.documentElement.clientHeight
    let points = []
    canvas.style = `position: fixed;top:0px;left:0px;width:${canvas_width}px;height:${canvas_height}px;`
    function draw() {
      ctx.clearRect(0, 0, canvas_width, canvas_height)
      let i,pi,x_dist,y_dist,dist,w
      points.forEach((p, index) => {
        p.x += p.xa
        p.y += p.ya
        p.xa *= (p.x >= canvas_width || p.x < 0? -1 : 1)
        p.ya *= p.y >= canvas_height || p.y < 0? -1 : 1
        ctx.fillRect(p.x - 0.5, p.y - 0.5, 1, 1)
        for(let i = index+1;i<points.length;i++){
          pi = points[i]
          x_dist = p.x - pi.x
          y_dist = p.y - pi.y
          dist = x_dist*x_dist + y_dist*y_dist
          w = (mix - dist) / mix
          if(dist < mix){
            ctx.beginPath()
            ctx.lineWidth = w/2
            ctx.strokeStyle = `rgba(110,110,110,${w + 0.2})`
            ctx.moveTo(p.x,p.y)
            ctx.lineTo(pi.x,pi.y)
            ctx.stroke()
          }
        }
      })
      requestAnimationFrame(draw)
    }
    for(let i=0;i<500;i++){
      points.push({
        x:Math.random()*canvas_width,
        y:Math.random()*canvas_height,
        xa: 2*Math.random()-1,
        ya: 2*Math.random()-1,
      })
    }
    let current = {}
    window.onmousemove = function(e){
      current.x = e.clientX
      current.y = e.clientY
      current.xa = 2*Math.random()-1
      current.ya = 2*Math.random()-1
    }
    window.onmouseout = ()=>{
      current.x = null
      current.y = null
    }
    draw()

  </script>
</body>
</html>